<extend name="Common/base" />
<block name="content">
<style>
        .auth-success {
            display: inline;
            padding: 0.4em .6em .3em;
            font-size: 75%;
            font-weight: bold;
            line-height: 1;
            color: #fff;
            text-align: center;
            white-space: nowrap;
            vertical-align: baseline;
            border-radius: .25em;
            background-color: #5cb85c;
            float: left;
            margin-top: -45px;
            margin-left: 10%;
        }
        .auth-error{
            display: inline;
            padding: 0.4em .6em .3em;
            font-size: 75%;
            font-weight: bold;
            line-height: 1;
            color: #fff;
            text-align: center;
            white-space: nowrap;
            vertical-align: baseline;
            border-radius: .25em;
            background-color: #b82927;
            float: left;
            margin-top: -45px;
            margin-left: 10%;
        }

    </style>
<div class="col-md-10">
    <div class="row">
        <div class="navbar navbar-default bootstrap-admin-navbar-thin">
            <ol class="breadcrumb bootstrap-admin-breadcrumb">
                <li>
                    <a href="#">首页</a>
                </li>
                <li>
                    <a href="#">商户中心</a>
                </li>
                <li class="active">商户认证</li>
            </ol>
        </div>
    </div>
</div>

<div class="container">
    <!-- left, vertical navbar & content -->
    <div class="row">
        <!-- left, vertical navbar -->
        <include file="Common/leftmenu" />

        <!-- content -->
        <div class="col-md-10">
            <div class="row">
                <div class="panel panel-default bootstrap-admin-no-table-panel">
                    <div class="panel-heading">
                        <div class="text-muted bootstrap-admin-box-title">商户  》》 {$member_info['company_name']}</div>
                    </div>
                    <div class="bootstrap-admin-no-table-panel-content bootstrap-admin-panel-content collapse in">
                            <fieldset>
                                <legend>手机认证</legend>
                                <div class="form-group">
                                    <label class="col-lg-2 control-label">手机号</label>
                                    <div class="col-lg-10" style="width: 30%;">
                                        <input disabled="disabled" class="form-control" id="mobile" type="text" value="{$mobile}" style="width: 200px;">
                                    </div><button class="btn btn-primary" id="mobilebtn">发送验证码</button>
                                </div>
                                <div>
                                    <label class="col-lg-2 control-label">验证码</label>
                                    <div class="col-lg-10">
                                        <input class="form-control" id="code" type="text" value="{$code}" style="width: 200px;">
                                    </div>
                                </div>
                                <button class="btn btn-primary"style="margin-left: 25%;margin-top: 10px;" id="checkver">确认认证</button>
                            </fieldset>
                    </div>
                </div>
            </div>

        </div>
    </div>

</div>

</block>
<block name="script">
<script type="text/javascript">

    $("#mobilebtn").on('click',function(){
        var mobile=  $("#mobile").val();
        if(mobile==''){
            $.message({
                message:'手机号不能为空',
                type:'warning'
            });
        }else{
            $("#mobilebtn").html('倒计时<span>60</span>秒');
            $("#mobilebtn").attr('disabled','disabled');
            $.post("{:U('BusinessCenter/obtain')}",{mobile:mobile},function(res){
                if(res.status===1){
                    $.message(res.info);
                }else{
                    $.message({
                        message:res.info,
                        type:'error'
                    });
                }
            })
            function timeD(){
                var num=$("#mobilebtn").find('span').text()-0;
                num--;
                if(num==0){
                    $("#mobilebtn").text('获取验证码');
                    $("#mobilebtn").removeProp('disabled');
                }else{
                    $("#mobilebtn").find('span').text(num);
                }


            }
            setInterval(timeD,1000)
        }
    })
    //验证
    $('#checkver').on('click',function () {
        var mobile=  $("#mobile").val();
        var code = $("#code").val();
        $.post("{:U('BusinessCenter/checkver')}",{mobile:mobile,code:code},function(res){
            if(res.status==1){
                $.message(res.info);
                setTimeout( function(){
                    location.href="{:U('BusinessCenter/index')}";
                },1500);
            }else{
                $.message({
                    message:res.info,
                    type:'error'
                });
            }
        })
    })

    $(function() {
        $('.datepicker').datepicker();
        $('.uniform_on').uniform();
        $('.chzn-select').chosen();
        $('.textarea-wysihtml5').wysihtml5({
            stylesheets: [
                '/public/logistics/vendors/bootstrap-wysihtml5-rails-b3/vendor/assets/stylesheets/bootstrap-wysihtml5/wysiwyg-color.css'
            ]
        });

        $('#rootwizard').bootstrapWizard({
            'nextSelector': '.next',
            'previousSelector': '.previous',
            onNext: function(tab, navigation, index) {
                var $total = navigation.find('li').length;
                var $current = index + 1;
                var $percent = ($current / $total) * 100;
                $('#rootwizard').find('.progress-bar').css('width', $percent + '%');
                // If it's the last tab then hide the last button and show the finish instead
                if ($current >= $total) {
                    $('#rootwizard').find('.pager .next').hide();
                    $('#rootwizard').find('.pager .finish').show();
                    $('#rootwizard').find('.pager .finish').removeClass('disabled');
                } else {
                    $('#rootwizard').find('.pager .next').show();
                    $('#rootwizard').find('.pager .finish').hide();
                }
            },
            onPrevious: function(tab, navigation, index) {
                var $total = navigation.find('li').length;
                var $current = index + 1;
                var $percent = ($current / $total) * 100;
                $('#rootwizard').find('.progress-bar').css('width', $percent + '%');
                // If it's the last tab then hide the last button and show the finish instead
                if ($current >= $total) {
                    $('#rootwizard').find('.pager .next').hide();
                    $('#rootwizard').find('.pager .finish').show();
                    $('#rootwizard').find('.pager .finish').removeClass('disabled');
                } else {
                    $('#rootwizard').find('.pager .next').show();
                    $('#rootwizard').find('.pager .finish').hide();
                }
            },
            onTabShow: function(tab, navigation, index) {
                var $total = navigation.find('li').length;
                var $current = index + 1;
                var $percent = ($current / $total) * 100;
                $('#rootwizard').find('.bar').css({width: $percent + '%'});
            }
        });
        $('#rootwizard .finish').click(function() {
            alert('Finished!, Starting over!');
            $('#rootwizard').find('a[href*=\'tab1\']').trigger('click');
        });
    });
</script>
</block>